import Vue from 'vue'
import App from './App.vue'

//  先下载路由 cnpm i vue-router -s 
//  引入路由包
import VueRouter from 'vue-router'
Vue.use(VueRouter) // 不要忘记要注册一下路由


// 导入axios
// import Axios from 'axios'
import axios from 'axios'
Vue.prototype.axios = axios


// 导入vue-resource （ajax请求）
import VueResource from 'vue-resource'
Vue.use(VueResource)  // 同样注册安装

// 引入css、js
import Mint from 'mint-ui'
import 'mint-ui/lib/style.css'
// 引入vuex
import Vuex from 'vuex'
Vue.use(Vuex)

// 先获取购物车本身有的数据
var car = JSON.parse(localStorage.getItem('car') || '[]')


var store = new Vuex.Store({
  state:{  // 存放状态
    car:car, 
  },
  mutations:{  // 存放如何更改状态
    addToCar(state,goodsinfo){
      var flag = false
      state.car.some(item =>{
        if(item.id == goodsinfo.id) {
          item.count += parseInt(goodsinfo.count)
          flag = true
          return true
        }
      })
      if(!flag){
        state.car.push(goodsinfo)
      }
      // 把购物车数据添加到本地存储
      localStorage.setItem('car',JSON.stringify(state.car))
    },
    updateGoodsInfo(state,goodsinfo){
       state.car.some(item =>{
         if(item.id == goodsinfo.id){
           item.count = parseInt(goodsinfo.count)
           return true;
         }
       })
       localStorage.setItem('car',JSON.stringify(state.car));
    },
    removeFormCar(state,id){
      state.car.some((item,i) =>{
        if(item.id == id){
          state.car.splice(i,1)
          return true;
        }
      })
      localStorage.setItem('car',JSON.stringify(state.car))
    }
     
    
  },
  getters:{   // 从state某个状态过滤后获取的新的状态
    // 把购物车数量同步到小徽标上
    getAllCount(state){    // this.$store.getters.getAllCount
      var b = 0;
      state.car.forEach(item => {
        b += item.count
      })
      return b
    },
    getGoodsCount(state){
      var o = {};
      state.car.forEach(item =>{
        o[item.id] = item.count;
      })
      return o;
    }
  }
})


// 按需引入mint-ui组件
// 引入顶部Header部分
// import { Header,Button } from 'mint-ui';
// Vue.component(Header.name, Header);
// Vue.component(Button.name, Header);

// 引入全局mint-Ui
import MintUI from 'mint-ui'
import 'mint-ui/lib/style.css'
Vue.use(MintUI)

// 引入底部mui部分
import './lib/mui/css/mui.min.css'
// 导入自己创建的路由模块
import router from './router'

// 将url配置全局模式
Vue.http.options.root = "http://www.liulongbin.top:3005"
axios.defaults.baseURL = 'http://www.liulongbin.top:3005';

// 加入过滤器  自己手写
// Vue.filter('timef',function(data){
//   let date = new Date(data),
//   y = date.getFullYear(),
//   m = date.getMonth()+1,
//   d = date.getDate(),

//   return `${y}-${m}-${d}`
// })

// 引入moment时间插件
import moment from 'moment'
Vue.filter('dateFormat',function(dataStr,pattern = "YYYY-MM-DD HH:mm:ss"){
  return moment(dataStr).format(pattern)
})
// 引入轮播图
import { Swipe, SwipeItem } from 'mint-ui';
Vue.component(Swipe.name, Swipe);
Vue.component(SwipeItem.name, SwipeItem);

new Vue({
  el:'#app',
  render: h => h(App),
  router,
  store,
})
